<template>
    <Layout>
        <Spin fix v-if="isSpin">
            <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
            <div>正在生成隐患审批单，请稍后</div>
        </Spin>
        <Form ref="form1" :model="form1" :label-width="120">
            <Row v-show="!switchFlag" class="query-form">
                <Col span="8">
                    <FormItem label="工程名称：">
                        <Input v-model="form1.projectName" type="text"/>
                    </FormItem>
                </Col>
                <Col span="8" offset="8">
<!--                    <Button @click="switchQuery(true)" class="ivu-btn-switch" type="text">展开∨</Button>-->
                    <Button @click="reset" class="ivu-btn-reset">重置</Button>
                    <Button class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
                </Col>
            </Row>
<!--            <Row v-show="switchFlag" class="query-form">-->
<!--                <Col span="8">-->
<!--                    <FormItem label="企业名称：" prop="esName">-->
<!--                        <Input class="query-form-el" type="text" v-model="form1.stdOrgName"></Input>-->
<!--                    </FormItem>-->
<!--                </Col>-->
<!--                <Col span="8">-->
<!--                    <FormItem label="所在区域：" prop="idCard">-->
<!--                        <Select class="query-form-el" filterable v-model="form1.locationId">-->
<!--                            <Option v-for="item in locationList" :value="item.codingCodeId" :key="item.codingCodeId">{{-->
<!--                                item.codingName }}-->
<!--                            </Option>-->
<!--                        </Select>-->
<!--                    </FormItem>-->
<!--                </Col>-->
<!--                <Col span="8">-->
<!--                    <FormItem label="评定状态：" prop="esTypeId">-->
<!--                        <Select class="query-form-el" filterable v-model="form1.appStatusId">-->
<!--                            <Option v-for="item in appStatusList" :value="item.codingCodeId" :key="item.codingCodeId">{{-->
<!--                                item.codingName }}-->
<!--                            </Option>-->
<!--                        </Select>-->
<!--                    </FormItem>-->
<!--                </Col>-->
<!--            </Row>-->
<!--            <Row v-show="switchFlag" class="query-form">-->
<!--                <Col span="8">-->
<!--                    <FormItem label="评定时间：">-->
<!--                        <Date-picker type="daterange" style="width: 95%" v-model="appDate"/>-->
<!--                    </FormItem>-->
<!--                </Col>-->

<!--                <Col span="8" offset="8">-->
<!--                    <Button @click="switchQuery(false)" class="ivu-btn-switch" type="text">收起∧</Button>-->
<!--                    <Button @click="reset" class="ivu-btn-reset">重置</Button>-->
<!--                    <Button class="ivu-btn-query" icon="md-search" @click="query">查询</Button>-->
<!--                </Col>-->
<!--            </Row>-->
            <!-- <Row v-show="switchFlag" class="query-form">
                 <Col span="8">

                 </Col>
             </Row>-->

            <Row class="query-form">
                <Col span="24">
                    <Button size="large" class="ivu-btn-add" icon="md-add" @click="addInfo">新增</Button>
                </Col>
            </Row>
        </Form>

        <Table ref='table' :height="tableHeight" size="small" :loading="loading" no-data-text="没有查询到相关数据!"
               @on-selection-change='getSelectRows'
               border :columns="columns1" :data="dataTable">
        </Table>
        <Row style="margin-right:10px;">
            <Col span="24">
                <Page style="float: right" :total="pagedata.total" :page-size="pagedata.pageSize"
                      @on-change="pageChange" @on-page-size-change="pageSizeChange" :page-size-opts="pageSizeArray"
                      show-total show-sizer show-elevator/>
            </Col>
        </Row>
        <Modal :title="add?'隐患通知单新增':'隐患通知单修改'" :transfer=false v-model="model1" :width=1000 @on-cancal="handleCancel">
            <Row>
                <Col span="24">
                    <Form ref="form1datacopy" :model="form1datacopy" :rules="ruleCustom" label-position="top">
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="11">
                                <FormItem label="工程名称：" prop="projectName">
                                    <Input v-model="form1datacopy.projectName" type="text"/>
                                </FormItem>
                            </Col>

                            <Col span="11">
                                <FormItem label="施工单位：" prop="constructionUnit">
                    <!--                <cascaderDom class="query-form-el" style="padding-top: 4px;width: 100%;" ref="constructionUnit"
                                                 @setOrgInfo="setOrgId" @setOrgname="setOrgName"
                                                 :currentOrgId="form1datacopy.constructionUnitId"
                                                 :currentOrgName="form1datacopy.constructionUnit" :orgTree="true"></cascaderDom>-->
                                    <Input v-model="form1datacopy.constructionUnit" type="text"/>
                                </FormItem>
                            </Col>

                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23">
                                <FormItem label="位置：" prop="position">
                                    <Input v-model="form1datacopy.position" type="text"/>
                                </FormItem>
                            </Col>

                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="11">
                                <FormItem label="检查日期：" prop="inspectionDate">
                                    <DatePicker type="date" placeholder="请选择" style="width: 100%;"
                                                v-model="form1datacopy.inspectionDate"></DatePicker>
                                </FormItem>
                            </Col>
                            <Col span="11">
                                <FormItem label="要求整改完成日期：" prop="completionDate">
                                    <DatePicker type="date" placeholder="请选择" style="width: 100%;"
                                                v-model="form1datacopy.completionDate"></DatePicker>
                                </FormItem>
                            </Col>
                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="11">
                                <FormItem label="巡检人员：" prop="inspectionPersonnel">
                                    <Input v-model="form1datacopy.inspectionPersonnel" type="text"/>
                                </FormItem>
                            </Col>
                            <Col span="11">
                                <FormItem label="项目负责人：" prop="projectLeader">
                                    <Input v-model="form1datacopy.projectLeader" type="text"/>
                                </FormItem>
                            </Col>
                        </Row>
<!--                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23">
                                <FormItem label="照片：">
                                    <div>
                                        <Upload ref="upload"
                                                :before-upload="beforeUpload"
                                                :show-upload-list="true"
                                                :max-size="10240"
                                                accept="image/jpg, image/jpeg,image/png,image/gif,image/bmp"
                                                multiple
                                                type="drag"
                                                :action="fileUrl">
                                            <div style="padding: 10px">
                                                <Icon type="ios-cloud-upload" size="45" style="color: #F27874"></Icon>
                                                <p>点击将文件拖拽到这里上传</p>
                                                <span style="font-size:8px;color: #797a64">支持扩展名：.jpg，jpeg，png 格式的图片</span>
                                            </div>
                                        </Upload>
                                    </div>
                                    <div v-show="uploadList.length>0" v-for="item in uploadList" :key='item'>
                                        <a @click="downloadFile(form1datacopy.id,item)">{{ item.fileName }}</a>
                                        <Button type="text" icon="md-trash" @click="remove1(item.id)"
                                                style="margin-left: 5px;margin-bottom: 3px"/>
                                    </div>
                                </FormItem>
                            </Col>
                        </Row>

                        <Row type="flex" justify="space-around" class="code-row-bg">

                            <Col span="23">
                                <FormItem label="检查发现问题：" prop="checkProblem">
                                    <Input v-model="form1datacopy.checkProblem" type="textarea" :rows="2"/>
                                </FormItem>
                            </Col>


                        </Row>-->
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23" >
                                <Button class="ivu-btn-add" icon="md-add" @click="addItemInfo()">新增问题</Button>
                            </Col>

                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23" style="margin-top: 10px;margin-bottom: 10px">
                                <Table height="300"  :loading="loading1" size="small" class="table" no-data-text="没有查询到相关数据!"
                                       highlight-row stripe border :columns="columns3" width="100%" :data="apsgNoticeItem">
                                </Table>
                            </Col>
                        </Row>
                    </Form>
                </Col>
            </Row>
            <div slot="footer">
                <Button :disabled="saveMod" class='ivu-btn-save' :loading="buttonLoading"
                        @click="submit('form1datacopy')">确定
                </Button>
                <Button class='ivu-btn-cancel' @click="handleCancel">取消</Button>
            </div>
        </Modal>
        <Modal title="隐患通知单详情" :transfer=false v-model="model2" :width=1000 class="modal-view-detail" @on-cancal="handleCancel">
            <Row>
                <Col span="24">
                    <Form :model="form1datacopy" :label-width="160">
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23">
                                <FormItem label="工程名称：" prop="projectName">
                                    {{form1datacopy.projectName}}
                                </FormItem>
                            </Col>

                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23">
                                <FormItem label="施工单位：" prop="constructionUnit">
                                    {{form1datacopy.constructionUnit}}
                                </FormItem>
                            </Col>

                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23">
                                <FormItem label="位置：" prop="position">
                                    {{form1datacopy.position}}
                                </FormItem>
                            </Col>

                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">

                            <Col span="11">
                                <FormItem label="检查日期：" prop="inspectionDate">
                                    {{this.formatDate(new Date(this.form1datacopy.inspectionDate), 'yyyy-MM-dd')}}
                                </FormItem>
                            </Col>
                            <Col span="11">
                                <FormItem label="要求整改完成日期：" prop="completionDate">
                                    {{this.formatDate(new Date(this.form1datacopy.inspectionDate), 'yyyy-MM-dd')}}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">

                            <Col span="11">
                                <FormItem label="巡检人员：" prop="inspectionDate">
                                    {{form1datacopy.inspectionPersonnel}}
                                </FormItem>
                            </Col>
                            <Col span="11">
                                <FormItem label="项目负责人：" prop="dateAppDate">
                                    {{form1datacopy.projectLeader}}
                                </FormItem>
                            </Col>
                        </Row>

                        <Row type="flex" justify="space-around" class="code-row-bg">

                            <Col span="23">
                                <FormItem label="巡检人员签字：">
                                    <div v-show="inspectionPersonnelFileList.length>0" v-for="item in inspectionPersonnelFileList" :key='item.id'  style="display: inline-block;margin-right: 10px">
                                        <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                                            <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                                        </router-link>
                                        <br>
                                        <a @click="downloadFile(form1datacopy.inspectionPersonnelFile,item)">{{ item.fileName }}</a>
                                    </div>
                                </FormItem>
                            </Col>

                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">

                            <Col span="23">
                                <FormItem label="项目负责人签字：">
                                    <div v-show="projectLeaderFileList.length>0" v-for="item in projectLeaderFileList" :key='item.id'  style="display: inline-block;margin-right: 10px">
                                        <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                                            <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                                        </router-link>
                                        <br>
                                        <a @click="downloadFile(form1datacopy.projectLeaderFile,item)">{{ item.fileName }}</a>
                                    </div>
                                </FormItem>
                            </Col>

                        </Row>
                       <!-- <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23">
                                <FormItem label="照片：">
                                    <div v-show="uploadList.length>0" v-for="item in uploadList" :key='item'  style="display: inline-block;margin-right: 10px">
                                        <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                                            <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                                        </router-link>
                                        <br>
                                        <a @click="downloadFile(form1datacopy.id,item)">{{ item.fileName }}</a>
                                    </div>
                                </FormItem>
                            </Col>
                        </Row>

                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23">
                                <FormItem label="检查发现问题：" prop="notes ">
                                    {{form1datacopy.checkProblem }}
                                </FormItem>
                            </Col>
                        </Row>-->
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23" style="margin-top: 10px;margin-bottom: 10px">
                                <Table height="300"  :loading="loading1" size="small" class="table" no-data-text="没有查询到相关数据!"
                                       highlight-row stripe border :columns="columns3" width="100%" :data="apsgNoticeItem">
                                </Table>
                            </Col>
                        </Row>
                    </Form>
                </Col>
            </Row>
            <div slot="footer">
                <Button class='ivu-btn-save' @click="handleCancel">关闭</Button>
            </div>
        </Modal>
        <Modal :transfer=false v-model="model4" :width=700  :title="addItem?'问题新增':'问题修改'"
               @on-cancel="model4=false;InputItemData={}">
            <div>
                <Form ref='InputItemData' :model="InputItemData" :rules="ruleCustom1" label-position="top">
                    <Row style="line-height: 42px;">
                        <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span='23'>
                            <FormItem label='检查发现问题：' prop="itemDesc">
                                <Input v-model="InputItemData.itemDesc" />
                            </FormItem>
                        </Col>
                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="23">
                                <FormItem label="照片：">
                                    <div>
                                        <Upload ref="upload"
                                                :before-upload="beforeUpload"
                                                :show-upload-list="true"
                                                :max-size="10240"
                                                accept="image/jpg, image/jpeg,image/png,image/gif,image/bmp"
                                                multiple
                                                type="drag"
                                                :action="fileUrl">
                                            <div style="padding: 10px">
                                                <Icon type="ios-cloud-upload" size="45" style="color: #F27874"></Icon>
                                                <p>点击将文件拖拽到这里上传</p>
                                                <span style="font-size:8px;color: #797a64">支持扩展名：.jpg，jpeg，png 格式的图片</span>
                                            </div>
                                        </Upload>
                                    </div>
                                    <div v-show="uploadList.length>0" v-for="item in uploadList" :key='item.id'>
                                        <a @click="downloadFile(form1datacopy.id,item)">{{ item.fileName }}</a>
                                        <Button type="text" icon="md-trash" @click="remove1(item.id,InputItemData.itemId)"
                                                style="margin-left: 5px;margin-bottom: 3px"/>
                                    </div>
                                </FormItem>
                            </Col>
                        </Row>
                    </Row>
                </Form>
            </div>
            <div slot="footer">
                <Button class='ivu-btn-save' :loading="buttonLoading" @click="submitItem('InputItemData')">确定</Button>
                <Button class='ivu-btn-cancel' @click="model4=false;InputItemData={}">取消</Button>
            </div>
        </Modal>

        <Modal :transfer=false v-model="model5"  :width=600 :title="'问题详情'"
               @on-cancel="model5=false" >
            <Form class="modal-view-detail" :model="InputItemData" label-position="top" >
                <Row style="line-height: 42px;">
                    <Col span='7'>
                        <span>检查发现问题：{{InputItemData.itemDesc}}</span>
                    </Col>

                </Row>
                <Row class="detail-background-clor" style="line-height: 42px;">
                    <Col span="23">
                        <FormItem label="照片：">
                            <div v-show="uploadList.length>0" v-for="item in uploadList" :key='item'  style="display: inline-block;margin-right: 10px">
                                <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                                    <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                                </router-link>
                                <br>
                                <a @click="downloadFile(form1datacopy.id,item)">{{ item.fileName }}</a>
                            </div>
                        </FormItem>
                    </Col>
                </Row>
            </Form>
            <div slot="footer">
                <Button class='ivu-btn-save' @click="model5=false">关闭</Button>
            </div>
        </Modal>


    </Layout>
</template>

<script>
    import {Api} from '../../../api'
    import {sessionStorage} from '../../../common/cacheUtils.js';
    import cascaderDom from '../../../components/cascader-dom.vue';
    import {formatDate} from '@/tools/index'
    export default {
        components: {
            cascaderDom
        },
        data() {
            return {
                isSpin: false,
                apsgNoticeItem: [],
                companyId: sessionStorage('userId').getObject('userId').companyId,
                appDate: ["", ""],
                appStatusList: [],
                fileUrl: Api.interestedPartiesUserFile,
                locationList: [],
                stdRankList: [],
                inspectionPersonnelFileList:[],
                projectLeaderFileList:[],
                index:null,
                downloadUrl: Api.downloadMongoFile,
                upUrl: Api.uploadMongoFile,
                switchFlag: false,
                saveMod: false,
                form1: {},
                uploadList: [],
                model5:false,
                InputItemData:{},
                ruleCustom1:{},
                pageSizeArray: [10, 20, 50],
                pagedata: {
                    total: 0,
                    pageSize: 10,
                    currentPage: 1,
                },
                dataTable: [],
                columns1: [
                    {
                        title: "序号",
                        width: 80,
                        align: "center",
                        fixed: 'left',
                        render: (h, params) => {
                            return h('span', params.index + (this.pagedata.currentPage - 1) * this.pagedata.pageSize + 1);
                        }
                    },
                    {
                        title: '工程名称',
                        minWidth: 300,
                        align: 'center',
                        key: 'projectName',
                    },
                    {
                        title: '施工单位',
                        minWidth: 300,
                        align: 'center',
                        key: 'constructionUnit',
                    },
                    {
                        title: '位置',
                        minWidth: 150,
                        align: 'center',
                        key: 'position',
                    },
                    {
                        title: '巡检人员',
                        minWidth: 150,
                        align: 'center',
                        key: 'inspectionPersonnel',
                    },
                    {
                        title: '项目负责人',
                        minWidth: 150,
                        align: 'center',
                        key: 'projectLeader',
                    },
                    {
                        title: '检查日期',
                        minWidth: 150,
                        align: 'center',
                        key: 'inspectionDate',
                        render: (h, params) => {
                            return h('div', [
                                (this.formatDate(new Date(params.row.inspectionDate), 'yyyy-MM-dd'))
                            ]);
                        }
                    },
                    {
                        title: '要求整改完成日期',
                        minWidth: 150,
                        align: 'center',
                        key: 'completionDate',
                        render: (h, params) => {
                            return h('div', [
                                (this.formatDate(new Date(params.row.completionDate), 'yyyy-MM-dd'))
                            ]);
                        }
                    },
                    {
                        title: '操作',
                        key: 'action',
                        fixed: 'right',
                        width: 250,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                    },
                                    on: {
                                        click: () => {
                                            this.showData(params, 1);
                                        }
                                    }
                                }, '详情'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                    },
                                    on: {
                                        click: () => {
                                            this.showData(params, 2);
                                        }
                                    }
                                }, '修改'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                        color: 'red',
                                    },
                                    on: {
                                        click: () => {

                                            this.$Modal.confirm({
                                                title: '数据删除',
                                                content: '<p>确定删除该条信息</p>',
                                                okText: '确认',
                                                onOk: () => {
                                                    this.deleteData(params);
                                                },
                                                cancelText: '取消'
                                            });

                                        }
                                    }
                                }, '删除'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                    },
                                    on: {
                                        click: () => {
                                            this.export(params.row)
                                        }
                                    }
                                }, '下载通知单')
                            ]);
                        }
                    },

                ],
                view:false,
                columns3: [
                    {
                        type: 'index',
                        title: '序号',
                        width: 80,
                        align: 'center',
                    },
                    {
                        minWidth: 150,
                        title: '检查发现问题',
                        align: 'center',
                        key: 'itemDesc',
                    },
                    {
                        minWidth: 150,
                        title: '图片',
                        align: 'center',
                        render: (h, params) => {
                        let hfn = [];
                            params.row.files.forEach(v => {
                                let url = this.fileUrl + '/file/' + v.id
                                hfn.push(
                                    h('img', {
                                        style: {
                                            width: "30px",
                                            margin: "3px",
                                            cursor: "pointer"
                                        },
                                        attrs: {
                                            src: url
                                        }
                                    })
                                )

                            });
                            return h('div', [...hfn]);

                        }
                    },

                    {
                        title: '操作',
                        key: 'action',
                        fixed: 'right',
                        width: 200,
                        align: 'center',
                        render: (h, params) => {
                            console.log(this.view);
                            if(this.view == false){
                                return h('div', [
                                    h('A', {
                                        props: {
                                            type: 'primary',
                                            size: 'small'
                                        },
                                        style: {
                                            fontSize: '14px',
                                        },
                                        on: {
                                            click: () => {
                                                this.InputItemData = JSON.parse(JSON.stringify(params.row));
                                                this.getFiles(params.row.itemId);
                                                this.model5 = true;
                                            }
                                        }
                                    }, '详情'),
                                    h('Divider', {
                                        props: {
                                            type: 'vertical',
                                        }
                                    }, ''),
                                    h('A', {
                                        props: {
                                            type: 'primary',
                                            size: 'small'
                                        },
                                        style: {
                                            fontSize: '14px',
                                        },
                                        on: {
                                            click: () => {
                                                // this.InputItemData = JSON.parse(JSON.stringify(params.row));
                                                // console.log(this.InputItemData);
                                                this.InputItemData = params.row
                                                this.getFiles(params.row.itemId);
                                                this.index = params.index;
                                                this.model4 = true;
                                                this.addItem = false;
                                            }
                                        }
                                    }, '修改'),
                                    h('Divider', {
                                        props: {
                                            type: 'vertical',
                                        }
                                    }, ''),
                                    h('A', {
                                        props: {
                                            type: 'error',
                                            size: 'small'
                                        },
                                        style: {
                                            fontSize: '14px',
                                            color: 'red',
                                        },
                                        on: {
                                            click: () => {
                                                this.$Modal.confirm({
                                                    title: '数据删除',
                                                    content: '<p>确定删除该条信息</p>',
                                                    okText: '确认',
                                                    onOk: () => {
                                                        this.apsgNoticeItem.splice(params.index,1);
                                                    },
                                                    cancelText: '取消'
                                                });
                                            }
                                        }
                                    }, '删除'),
                                ]);
                            }else{
                                return h('div', [
                                    h('A', {
                                        props: {
                                            type: 'primary',
                                            size: 'small'
                                        },
                                        style: {
                                            fontSize: '14px',
                                        },
                                        on: {
                                            click: () => {
                                                this.InputItemData = JSON.parse(JSON.stringify(params.row));
                                                this.getFiles(params.row.itemId);
                                                this.model5 = true;
                                            }
                                        }
                                    }, '详情'),
                                ]);
                            }





                        }
                    }
                ],
                ruleCustom: {
                    projectName: [{
                        validator: (rule, value, callback) => {
                            if (this.form1datacopy.projectName == null || this.form1datacopy.projectName == '' || this.form1datacopy.projectName == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    constructionUnit: [{
                        validator: (rule, value, callback) => {
                            if (this.form1datacopy.constructionUnit == null || this.form1datacopy.constructionUnit == '' || this.form1datacopy.constructionUnit == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    position: [{
                        validator: (rule, value, callback) => {
                            if (this.form1datacopy.position == null || this.form1datacopy.position  == '' || this.form1datacopy.position  == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    inspectionDate: [{
                        validator: (rule, value, callback) => {
                            if (this.form1datacopy.inspectionDate == null || this.form1datacopy.inspectionDate == '' || this.form1datacopy.inspectionDate == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    completionDate: [{
                        validator: (rule, value, callback) => {
                            if (this.form1datacopy.completionDate == null || this.form1datacopy.completionDate == '' || this.form1datacopy.completionDate == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    inspectionPersonnel: [{
                        validator: (rule, value, callback) => {
                            if (this.form1datacopy.inspectionPersonnel == null || this.form1datacopy.inspectionPersonnel == '' || this.form1datacopy.inspectionPersonnel == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    projectLeader: [{
                        validator: (rule, value, callback) => {
                            if (this.form1datacopy.projectLeader == null || this.form1datacopy.projectLeader == '' || this.form1datacopy.projectLeader == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],

                },
                model4:false,
                stdOrgName: '',
                stdOrgId: '',
                add: false,
                model1: false,
                buttonLoading: false, model2: false,
                showdata: {},
                location: null,
                form1datacopy: {},
                files: [],
                loading1:false,
                addItem:false,
                tableHeight: 10, loading: false,
            }
        },
        mounted() {
            this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 145;
            this.selectCodingSort();
            let orgId = sessionStorage('userId').getObject('userId')
            /*    this.companyId = sessionStorage('userId').getObject('userId').companyId;*/
            this.query();
        },
        computed: {
            columns10() {
                const columns = [...this.columns3];
                const columns10=[]
                columns.forEach(item=>{
                    if (item.title != '操作'){
                        columns10.push(item)
                    }else{
                        console.log(item);
                    }
                });
                return columns10
            },
        },
        methods: {
            getFiles(id) {
                let url = this.fileUrl + '/' + id + '/files/picture'
                this.$http.get(url).then((res) => {
                    if (res.data.result == "success") {
                        this.uploadList  = res.data.data
                    }
                })
            },

            getFiles1(id,str) {
                console.log(id)
                let url = this.fileUrl + '/' + id + '/files/picture'
                this.$http.get(url).then((res) => {
                    if (res.data.result == "success") {
                        if (str === "1"){
                            this.inspectionPersonnelFileList  = res.data.data
                        } else if(str === "2") {
                            this.projectLeaderFileList  = res.data.data
                        }
                        this.uploadList  = res.data.data
                    }
                })
            },
            submitItem(name){
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        if (this.addItem){
                            this.apsgNoticeItem.push(this.InputItemData);
                            this.model4 = false;
                        } else{

                            let index = this.index;
                            this.getFiles(this.InputItemData.itemId);
                            this.model4 = false;
                            setTimeout(()=>{
                                this.apsgNoticeItem[index] = this.InputItemData;

                            },1000)

                        }

                    }else{
                        this.$Message.error('请填报完整!');
                    }
                })
            },
            getFile(id){
                let hFn = [];
                let files = [];
                let url = this.fileUrl + '/' + id + '/files/picture'
                this.$http.get(url).then((res) => {
                    if (res.data.result == "success") {
                        files  = res.data.data
                        params.row.files.forEach(v => {
                            if (v) {
                                console.log(v)
                                hFn.push(
                                    h('img', {
                                        style: {
                                            width: "30px",
                                            margin: "3px",
                                            cursor: "pointer"
                                        },
                                        attrs: {
                                            src: v.picture
                                        }
                                    })
                                )
                            }
                        });
                        return hFn
                    }
                })

            },
            addItemInfo(){
                this.addItem = true;
                this.uploadList = [];
                this.InputItemData = {
                    itemId:this.get_uuid(),
                    files:[],
                };
                this.model4 = true
            },
            beforeUpload(file) {
                var index = file.name.lastIndexOf(".");
                var suffix = file.name.substr(index + 1);

                if (suffix != 'jpg' && suffix != 'jpeg' && suffix != 'png') {
                    this.$Message.error("请上传jpg,jpeg,png格式的图片");
                    this.file = null;
                    this.fileName = null;
                } else {
                    let formData = new FormData();
                    formData.append("files", file); // 文件对象
                    let url = this.fileUrl + '/' +this.InputItemData.itemId + '/files/picture'
                    this.$http.post(url, formData).then((res) => {
                        if (res.data.result == "success") {
                            this.$Message.info("文件上传成功")
                            this.getFiles(this.InputItemData.itemId);
                            setTimeout(()=>{
                                this.InputItemData.files=this.uploadList
                            },300)
                        }
                    })
                }

                return false
            },
            downloadFile(guideId, file) {
                let url = this.fileUrl + '/file/' + file.id;
                this.$http.get(url, {
                    responseType: 'blob'      //告诉服务器我们需要的响应格式
                }).then((res) => {

                    const aLink = document.createElement("a");
                    let blob = new Blob([res.data], {
                        type: res.bodyBlob.type      //将会被放入到blob中的数组内容的MIME类型
                    });
                    aLink.href = URL.createObjectURL(blob)
                    aLink.download = file.fileName //标题
                    aLink.click()
                    document.body.appendChild(aLink)
                })
            },

            remove1(id,itemId) {
                let url = this.fileUrl + '/file/' + id;
                this.$http.delete(url).then((res) => {
                    this.getFiles(itemId)
                })
            },

            selectLocation(location) {
                this.form1datacopy.locationId = location.value;
                this.form1datacopy.location = location.label;
            },
            selectstdRank(stdRank) {
                this.form1datacopy.stdRankId = stdRank.value;
                this.form1datacopy.stdRank = stdRank.label;
            },
            selectAppStatus(appStatus) {
                this.form1datacopy.appStatusId = appStatus.value;
                this.form1datacopy.appStatus = appStatus.label;
            },
            beforeUploadOther(file) {
                this.files.push(file);
                return false;
            },
            deleteFile(index) {
                this.files.splice(index, 1);
            },
            setOrgId(data) {
                this.form1datacopy.constructionUnitId = data[data.length - 1];
            },
            setOrgName(data) {
                this.form1datacopy.constructionUnit = data;
            },
            setUserId1(data) {
                console.log(data);
                this.form1datacopy.inspectionPersonnelId = data[data.length - 1];
            },
            setUserName1(data) {
                this.form1datacopy.inspectionPersonnel = data;
            },
            setUserId2(data) {
                this.form1datacopy.projectLeaderId = data[data.length - 1];
            },
            setUserName2(data) {
                this.form1datacopy.projectLeader = data;
            },
            deleteData(params) {
                let data = {
                    id:params.row.id
                }
                let url = Api.deleteAspgNotice;
                this.$http.delete(url, {params: data}).then((res) => {
                    if (res.data.status === 200) {
                        this.$Message.success('成功');
                        this.query()
                    } else if (res.data.status === 201) {
                        this.$Message.error(res.data.msg);

                    }
                }).catch(e => {
                    this.$Message.error('请求失败' + e);
                })
            },


            getSelectRows(rows) {
                this.deleteRows = rows;
            },
            batDelete() {

            },
            get_uuid() {
                let s = [];
                let hexDigits = "0123456789abcdef";
                for (let i = 0; i < 36; i++) {
                    s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
                }
                s[14] = "4";
                s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);
                s[8] = s[13] = s[18] = s[23] = "-";

                let uuid = s.join("");
                let reg = new RegExp("-", "g");
                let a = uuid.replace(reg, "");
                console.log(a);
                return a;
            },
            setOrgId1(data) {
                this.form1.orgId = data[data.length - 1];
            },
            setOrgName1(data) {
                this.form1.orgName = data;
            },
            addInfo() {
                this.view = false;
                this.apsgNoticeItem = [];
                this.uploadList = [];
                this.saveMod = false;
                this.form1datacopy = {
                };
                this.stdOrgName = '';
                this.stdOrgId = '';
                this.files = [];
                this.model1 = true;
                this.add = true;
            },
            pageChange(pageNum) {
                this.pagedata.currentPage = pageNum;
                this.query();
            },
            pageSizeChange(pageSize) {
                this.pagedata.pageSize = pageSize;
                this.query();
            },
            handleCancel() {
                this.form1datacopy = {};
                this.apsgNoticeItem=[]
                this.apsgNoticeItem.files=[]
                this.uploadList = [];
                this.model1 = false;
                this.model2=false
            },
            selectCodingSort() {
                this.$http.get(Api.queryCodeDetailBySortId + '/AS-000001', {params: {}}).then((res) => {
                    this.appStatusList = res.data.data;
                });
                this.$http.get(Api.queryCodeDetailBySortId + '/REGION-000001', {params: {}}).then((res) => {
                    this.locationList = res.data.data;
                });
                this.$http.get(Api.queryCodeDetailBySortId + '/SSL-000001', {params: {}}).then((res) => {
                    this.stdRankList = res.data.data;
                });

            },
            switchQuery(flag) {
                this.switchFlag = flag;
                if (!this.switchFlag) {
                    this.tableHeight = this.tableHeight + 44;
                } else {
                    this.tableHeight = this.tableHeight - 44;
                }
            },
            reset() {
                this.form1 = {};
                this.query();

            },
            query() {
                this.loading = true;
                let userId = sessionStorage('userId').getObject('userId').userId;
                let data = {
                    startPage: this.pagedata.currentPage,
                    size: this.pagedata.pageSize,
                    orgId: sessionStorage('userId').getObject('userId').companyId

                };
                data = Object.assign(data, JSON.parse(JSON.stringify(this.form1)));

                let url = Api.queryAspgNotice;
                this.$http.get(url, {params: data}).then((res) => {
                    this.dataTable = res.data.data.data;
                    this.pagedata.total = res.data.data.totalSize;
                    this.loading = false;
                }).catch(e => {
                    this.$Message.error("数据获取失败")
                })
            },
            showData(data, flag) {
                this.loading1=true
                this.stdOrgId = data.row.stdOrgId;
                this.stdOrgName = data.row.stdOrgName;
                this.form1datacopy = JSON.parse(JSON.stringify(data.row));
                // this.form1datacopy = data.row;
                this.form1datacopy.inspectionDate = this.formatDate(new Date(this.form1datacopy.inspectionDate), 'yyyy-MM-dd');
                this.form1datacopy.completionDate = this.formatDate(new Date(this.form1datacopy.completionDate), 'yyyy-MM-dd');
                let apsgNoticeItem=data.row.apsgNoticeItems

                apsgNoticeItem.forEach(v =>{
                    let url = this.fileUrl + '/' + v.itemId + '/files/picture'
                    this.$http.get(url).then((res) => {
                        if (res.data.result == "success") {
                            v.files = res.data.data
                        }
                    })
                });
                setTimeout(()=>{
                    this.apsgNoticeItem=apsgNoticeItem
                    this.loading1=false
                },1000)
                if (flag == 1) { //查看页面
                    this.view = true;
                    if (this.form1datacopy.inspectionPersonnelFile){
                        this.getFiles1(this.form1datacopy.inspectionPersonnelFile,"1")
                    }else{
                        this.inspectionPersonnelFileList=[];
                    }
                    if (this.form1datacopy.projectLeaderFile){
                        this.getFiles1(this.form1datacopy.projectLeaderFile,"2")
                    }else{
                        this.projectLeaderFileList=[]
                    }


                    this.model2 = true;
                } else {//修改页面
                    this.view = false;
                    this.form1datacopy = JSON.parse(JSON.stringify(data.row));
                    this.saveMod = false;
                    this.add = false;
                    this.files = [];
                    this.model1 = true;
                }
            },
            submit(name) {
                this.$refs[name].validate((valid) => {
                    this.form1datacopy.apsgNoticeItems = this.apsgNoticeItem
                    if (valid) {
                        this.buttonLoading = true
                        this.saveMod = true;
                        this.form1datacopy.appDate = this.formatDate(new Date(this.form1datacopy.appDate), 'yyyy-MM-dd');
                        this.form1datacopy.dateAppDate = this.formatDate(new Date(this.form1datacopy.dateAppDate), 'yyyy-MM-dd');

                        if (this.add) {
                            let userId = sessionStorage('userId').getObject('userId').userId;
                            let orgId = sessionStorage('userId').getObject('userId').orgInfo.orgId;
                            this.form1datacopy.createUsrId = userId;
                            this.form1datacopy.createOrgId = orgId;
                            this.$http.post(Api.saveAspgNotice, this.form1datacopy).then((res) => {
                                if (res.data.status === 200) {
                                    this.$Message.success('成功');
                                    this.model1 = false;
                                    this.saveMod = false;

                                    this.query()

                                } else if (res.data.status === 201) {
                                    this.$Message.error(res.data.msg);
                                    this.model1 = false;
                                }
                                this.buttonLoading = false
                            }).catch(e => {
                                this.model1 = false;
                                this.query();
                                this.buttonLoading = false
                                this.$Message.error("数据获取失败")
                            })
                        } else {
                            let userId = sessionStorage('userId').getObject('userId').userId;
                            let orgId = sessionStorage('userId').getObject('userId').orgInfo.orgId;
                            this.form1datacopy.updateUserId = userId;
                            this.form1datacopy.updateOrgId = orgId;
                            this.$http.post(Api.updateAspgNotice, this.form1datacopy).then((res) => {
                                if (res.data.status === 200) {
                                    this.$Message.success('成功');
                                    this.saveMod = false;
                                    this.model1 = false;

                                    this.query()

                                } else if (res.data.status === 201) {
                                    this.$Message.error(res.data.msg);
                                    this.model1 = false;
                                }
                                this.buttonLoading = false
                            }).catch(e => {
                                this.model1 = false;
                                this.query();
                                this.buttonLoading = false
                                this.$Message.error("数据获取失败")
                            })
                        }


                    } else {
                        this.$Message.error('请填报完整!');
                    }
                })
            },
            formatDate(date, fmt) {
                if (/(y+)/.test(fmt)) {
                    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
                }
                let o = {
                    'M+': date.getMonth() + 1,
                    'd+': date.getDate(),
                    'h+': date.getHours(),
                    'm+': date.getMinutes(),
                    's+': date.getSeconds()
                };
                for (let k in o) {
                    if (new RegExp(`(${k})`).test(fmt)) {
                        let str = o[k] + '';
                        fmt = fmt.replace(RegExp.$1, RegExp.$1.length === 1 ? str : this.padLeftZero(str));
                    }
                }
                return fmt;
            },
            padLeftZero(str) {
                return ('00' + str).substr(str.length);
            },
            export(row){
                this.isSpin = true;
                this.$http.get(Api.exportApsgNotice + row.id,{
                    params:{},
                    responseType: 'arraybuffer'
                }).then((res) => {
                    const aLink = document.createElement("a");
                    let blob = new Blob([res.data], {
                        type: "application/vnd.ms-excel"
                    })
                    aLink.href = URL.createObjectURL(blob);
                    aLink.download = "隐患通知单("+ formatDate(new Date(), "yyyy-MM-dd")+ ").xlsx" //标题
                    aLink.click();
                    document.body.appendChild(aLink);
                    this.isSpin = false;
                }).catch(e => {
                    this.$Message.error("数据获取失败");
                    this.isSpin = false;
                })
            }
        },
        watch: {
            "model1": function (qw, er) {
                if (qw && this.model1) {
                    setTimeout(() => {
                        this.$refs.constructionUnit.setCurrentOrg();
                        this.$refs.inspectionPersonnel.setCurrentOrg();
                        this.$refs.projectLeader.setCurrentOrg();

                    }, 100)
                } else {
                    this.$refs.constructionUnit.resetCurrentOrg();
                    this.$refs.inspectionPersonnel.resetCurrentOrg();
                    this.$refs.projectLeader.resetCurrentOrg();

                }
            },

        },


    }
</script>

<style lang='css' scoped>
    @import '../../../index.css';
    .demo-spin-icon-load{
        animation: ani-demo-spin 1s linear infinite;
    }
    @keyframes ani-demo-spin {
        from { transform: rotate(0deg);}
        50%  { transform: rotate(180deg);}
        to   { transform: rotate(360deg);}
    }
</style>
